@import "mixin";
@import "var";

.f-sm {
  font-size: 24px;
}

.f {
  font-size: 28px;
}
.flex-row {
  flex-direction: row;
}
.align-flex-end {
  align-items: flex-end;
}
.text-gold {
  color: $color-gold;
}
.text-danger {
  color: $color-danger;
}
.text-warning {
  color: $color-warning;
}
.text-purple {
  color: $color-purple;
}
.text-pink {
  color: $color-pink;
}
.text-orange {
  color: $color-orange;
}
.text-sky {
  color: $color-sky;
}
.text-primary {
  color: $color-primary;
}
.text-info {
  color: #409FD6;
}
.text-success {
  color: $color-success;
}
.text-gray {
  color: $color-gray;
}
.text-muted {
  color: $color-muted;
}

.text-light {
  color: $color-light;
}

.flex-row {
  flex-direction: row;
  align-items: center;
}

.space-between {
  justify-content: space-between;
}

.align-end {
  align-items: flex-end;
}

.bg-white {
  background-color: #FFFFFF;
}

.bg-primary {
  background-color: $brand-primary;
}

.bg-warning {
  background-color: $brand-warning;
}

.bd-l {
  @include border-left(1, solid, #ddd)
}
.bd-t {
  @include border-top(1, solid, #ddd)
}
.bd-r {
  @include border-right(1, solid, #ddd)
}
.bd-b {
  @include border-bottom(1, solid, #ddd)
}

.flex-1 {
  flex: 1;
}

.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}